<template>
  <div class="cascader">
    <el-cascader-panel
      type="primary"
      :options="options"
      :props="props"
      collapse-tags
      @change="changecollectTaskTown"
      v-model="area"
    ></el-cascader-panel>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "cascader",
  props: {
    props: {
      type: Object,
    },
    options: {
      type: Array,
    },
  },
  data() {
    return {
      villageMatch: [],
      townMatch: [],
      townVillage: {},
      townVillageCopy: {},
    };
  },
  computed: {
    ...mapGetters({
      options: "getTreeData/filtersVillage",
    }),
  },
  mounted() {
    this.villageInit();
  },

  methods: {
    villageInit() {
      this.options.forEach((item) => {
        this.townMatch.push(item.value);
        this.villageMatch.push([
          ...JSON.stringify([item.children]).match(/\d{12}/g),
        ]);
      });
    },
    changecollectTaskTown(e) {
      let newSelect = new Map();
      // ,newSelectTown = [],children;
      e.forEach((item) => {
        let town;
        let townIndex = this.townMatch?.indexOf(item[0]);
        let villageIndex = this.villageMatch[townIndex]?.indexOf(item[1]);
        town = JSON.parse(JSON.stringify(this.options[townIndex]));
        town.children = [
          JSON.parse(
            JSON.stringify(this.villageMatch[townIndex][villageIndex])
          ),
        ];

        if (newSelect.get(town.value)) {
          newSelect.get(town.value).children = [
            ...newSelect.get(town.value).children,
            ...town.children,
          ];
        } else {
          newSelect.set(town.value, town);
        }
      });
      newSelect.forEach((item, key) => {
        // newSelectTown.push(item);
        this.townVillage[key] = item.children;
      });
      console.log(JSON.stringify(this.townVillage));
      // this.townVillage = newSelectTown;
    },
  },
};
</script>

<style></style>
